<template>
    <div class="l-from-body" >
        <el-form :model="formData" :rules="rules" size="mini"  ref="form" label-width="80px" >
            <el-col :span="24" v-if="formData.f_Id">
              <el-form-item>
                <el-image
                  style="height:160px;"
                  fit="contain"
                  :src="`${apiUrl}system/annexesfile/${formData.f_Id}?token=${token}`"
                  :preview-src-list="[`${apiUrl}system/annexesfile/${formData.f_Id}?token=${token}`]"
                >
                </el-image>
              </el-form-item>
            </el-col>
            <el-col :span="24" >
                <el-form-item :label="$t('名称')" prop="f_FileName">
                    <el-input v-model="formData.f_FileName"></el-input>
                </el-form-item>
            </el-col>
            <el-col :span="24" >
                <el-form-item :label="$t('分类')" prop="f_FileType">
                  <l-tree-select
                    :options="lr_dataItemTree(this.lr_dataItem['ImgType'])"
                    v-model="formData.f_FileType"
                   ></l-tree-select>
                </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item :label="$t('私有')" prop="f_IsPublic" >
                <el-switch
                    :active-value="0"
                    :inactive-value="1"
                    v-model="formData.f_IsPublic"
                    >
                </el-switch>
              </el-form-item>
            </el-col>
        </el-form>
    </div>
</template>
<script>
export default {
    data(){
        return {
            formData:{
              f_FileName:'',
              f_FileType:'',
              f_IsPublic:''
            },
            rules: {
                f_FileName: [
                    { required: true, message: this.$t('请输入') }
                ]
            }
        };
    },
    methods:{
        resetForm(){
          this.formData.f_Id = ''
          this.$refs.form && this.$refs.form.resetFields()
        },
        // 校验表单
        async validateForm() {
          if (!await this.$formValidateWraper(this.$refs.form)) {
            return false  
          }
          return true
        },
        setForm(data){
          const formData = this.$deepClone(data)
          this.formData = formData
        },
        getForm(){
          return this.$deepClone(this.formData)
        }
    }
}
</script>